<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>服务报告内容</title>
		<!-- css代码 start -->
		<link href="../../../../css/mui.min.css" rel="stylesheet" />
		<link href="../../../../css/global.css" rel="stylesheet" />
		<link href="../../../../css/style.css" rel="stylesheet" />
		<link href="../../../../css/checkbox.css" rel="stylesheet" />
		<style>
			.mui-checkbox input[type=checkbox], .mui-radio input[type=radio]{
				top: 8px;
				right: -10px;
			}
			.details_con .clum {
				height: auto;
			}
			.details_con .clum .name {
				line-height: inherit;
				padding: 15px 10px 15px 0;
			}
			.details_con .clum .txt {
				float: none;
				text-align: right;
				line-height: inherit;
				padding: 15px 0;
			}
			.item_box .item .bar{
				display: flex;
				align-items: center;
				height: auto;
				min-height: 37px;
			}
			.item_box .item .bar .number{
				display: flex;
				align-items: center;
			}
			.item_box .item .bar .number img{
				margin-top: 0;
			}
			.item_box .item .bar .number .title-text{
				flex: 1;
				line-height: 1.2;
			}
			.item_box .item .text{
				display: flex;
				min-height: 30px;
				height: auto;
				line-height: 1.4;
				align-items: center;
			}
			.item_box .item .text span.cen{
				flex: 1;
				margin-left: 0;
			}
		</style>
		<!-- css代码 end -->
	</head>
	<body>

		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 id="title" class="mui-title">服务报告</h1>
		</header>
		<div class="mui-content" id="mui-content">
			<div class="page_cen shadow title_num">服务编号：<span class="fr">{{service_no}}</span></div>
			<div class="page_cen shadow">
				<p class="bg_title">基本信息</p>
				<div class="details_con mt0">
					<div class="clum mr">
						<span class="name">FactoryPO</span>
						<span class="txt">{{SellOrderNo}}</span>
					</div>
					<div class="clum mr">
						<span class="name">合同编号</span>
						<span class="txt">{{CONTRACT_ID}}</span>
					</div>
					<div class="clum mr">
						<span class="name">派工号</span>
						<span class="txt">{{service_no}}</span>
					</div>
					<div class="clum mr">
						<span class="name">工程师</span>
						<span class="txt">{{engineer_name}}</span>
					</div>
					<div class="clum mr">
						<span class="name">用户</span>
						<span class="txt">{{customer}}</span>
					</div>
					<div class="clum mr">
						<span class="name">地址</span>
						<span class="txt">{{dept_address}}</span>
					</div>
					<div class="clum mr">
						<span class="name">负责人</span>
						<span class="txt">{{operator}}</span>
					</div>
					<div class="clum mr">
						<span class="name">手机</span>
						<span class="txt">{{mobile}}</span>
					</div>
					<div class="clum mr">
						<span class="name">邮箱</span>
						<span class="txt">{{email}}</span>
					</div>
					<div class="clum mr">
						<span class="name">仪器型号</span>
						<span class="txt">{{model}}</span>
					</div>
					<div class="clum mr">
						<span class="name">序号</span>
						<span class="txt">{{serial_no}}</span>
					</div>
					<div class="clum mr">
						<span class="name">计算机</span>
						<span class="txt">{{computer}}</span>
					</div>
					<div class="clum mr">
						<span class="name">服务号</span>
						<span class="txt">{{service_number}}</span>
					</div>
					<div class="clum mr">
						<span class="name">省份</span>
						<span class="txt">{{province}}</span>
					</div>
					<div class="clum mr">
						<span class="name">邮编</span>
						<span class="txt">{{postal_code}}</span>
					</div>
					<div class="clum mr">
						<span class="name">电话</span>
						<span class="txt">{{phone_no}}</span>
					</div>
					<div class="clum mr">
						<span class="name">传真</span>
						<span class="txt">{{fax_no}}</span>
					</div>
					<div class="clum mr">
						<span class="name">软件</span>
						<span class="txt">{{software}}</span>
					</div>
					<div class="clum mr">
						<span class="name">操作系统</span>
						<span class="txt">{{operation_system}}</span>
					</div>
				</div>
			</div>

			<div class="page_cen shadow">
				<!-- <p class="bg_title">基本信息</p> -->
				<div class="details_con mt0">
					<div class="clum mr">
						<span class="name">服务类型</span>
						<span class="txt">{{service_type}}</span>
					</div>

					<div class="clum mr">
						<span class="name">接受任务时间</span>
						<span class="txt">{{order_received_date}}</span>
					</div>
					<div class="clum mr">
						<span class="name">出发时间</span>
						<span class="txt">{{start_travel_date}}</span>
					</div>
					<div class="clum mr">
						<span class="name">到达现场时间</span>
						<span class="txt">{{on_site_data}}</span>
					</div>
					<div class="clum mr">
						<span class="name">总旅途时间（小时）</span>
						<span class="txt">{{travel_time}}</span>
					</div>
					<div class="clum mr">
						<span class="name">工作开始时间</span>
						<span class="txt">{{start_working_time}}</span>
					</div>
					<div class="clum mr">
						<span class="name">工作结束时间</span>
						<span class="txt">{{end_working_time}}</span>
					</div>
					<div class="clum mr">
						<span class="name">总工作时间（小时）</span>
						<span class="txt">{{total_working_hours}}</span>
					</div>
					<div class="clum mr">
						<span class="name">应用支持时间（小时）</span>
						<span class="txt">{{app_support_hours}}</span>
					</div>
					<div class="clum mr">
						<span class="name">等待客户时间（小时）</span>
						<span class="txt">{{waiting_hours}}</span>
					</div>
				</div>
			</div>

			<div class="page_cen shadow autoHeight">
				<p class="bg_title nobor">故障</p>
				<div class="bg_info">{{problem}}</div>
			</div>


			<div class="page_cen shadow autoHeight">
				<p class="bg_title nobor">工作过程</p>
				<div class="bg_info">{{action_taken}}</div>
			</div>

			<div class="page_cen shadow autoHeight">
				<p class="bg_title nobor">结果</p>
				<div class="bg_info">{{results}}</div>
			</div>
			<div class="page_cen shadow autoHeight">
				<p class="bg_title nobor">工程师建议</p>
				<div class="bg_info">{{engineers_advis}}</div>
			</div>

			<!-- <div class="page_cen shadow">
				<p class="bg_title nobor">Error Code</p>
				<div class="item_box mt0">
					<div class="item mr">
						<div class="bar">
							<span class="number">1170001<img src="../../../../images/icon_105.png" /></span>
						</div>
						<div class="text">
							<span class="l">ErrorCode：</span>
							<span class="cen">系统找不到指定的文件</span>
						</div>
						<div class="type">
							<p>描述：<span>需找到文件路径</span><img src="../../../../images/icon_218.png" /></p>
						</div>
					</div>
				</div>
			</div> -->
			<div class="page_cen shadow" v-show="isShowPartData">
				<p class="bg_title nobor">备件列表</p>
				<div class="item_box mt0">
					<div class="item mr" v-for="partData in partDatas">
						<div class="bar">
							<span class="number">
								<img src="../../../../images/icon_204.png" />
								<div class="title-text">{{partData.Part_no}}</div>
							</span>
						</div>
						<div class="text">
							<span class="l">备件名称：</span>
							<span class="cen">{{partData.Part_name}}</span>
						</div>
						<div class="text">
							<span class="l">序列号：</span>
							<span class="cen">{{partData.serial_number}}</span>
						</div>
						<div class="type">
							<p>借货单号：<span>{{partData.Part_DebitNo}}</span></p>
							<p>数量：<span>{{partData.qty}}</span></p>
							<p>单价：<span>{{partData.Price}}</span></p>
							<p>总价：<span>{{partData.TotalPrice}}</span></p>
						</div>
					</div>
				</div>
			</div>
			<div class="page_cen shadow" id="fwfy">
				<p class="bg_title">费用信息</p>
				<div class="details_con mt0">
					<div class="clum mr">
						<span class="name">数量/小时</span>
						<span class="txt">{{ManHours}}</span>
					</div>
					<div class="clum mr">
						<span class="name">单价</span>
						<span class="txt">{{ManRate}}</span>
					</div>
					<div class="clum mr">
						<span class="name">总计</span>
						<span class="txt">{{ManTotal}}</span>
					</div>

					<div class="clum mr" id="divBasicFee">
						<span class="name">基本费</span>
						<span class="txt">{{BasicFee}}</span>
					</div>

					<div class="clum mr" id="divTravelHotel">
						<span class="name">旅途和住宿费</span>
						<span class="txt">{{TravelHotel}}</span>
					</div>
					<div class="clum mr" id="divTravelLabor">
						<span class="name">旅途和人工费</span>
						<span class="txt">{{TravelLabor}}</span>
					</div>

					<div class="clum mr">
						<span class="name">备件总费用</span>
						<span class="txt">{{PartsTotallFee}}</span>
					</div>

					<div class="clum mr" id="divEspeciallyFee">
						<span class="name">特殊费用</span>
						<span class="txt">{{EspeciallyFee}}</span>
					</div>
					<div class="clum mr">
						<span class="name">总费用（含13%税）</span>
						<span class="txt">{{RebTotalBilled}}</span>
					</div>
				</div>
			</div>
			<div style="height: 5px;"></div>
		</div>



		<!-- js代码 start -->

		<!-- 基础js start -->
		<script src="../../../../js/mui.min.js"></script>
		<script src="../../../../js/utils/h.js"></script>
		<script src="../../../../js/constant.js"></script>
		<script src="../../../../js/common.js"></script>
		<script src="../../../../js/utils/base64.js"></script>
		<script src="../../../../js/utils/md5.js"></script>
		<script src="../../../../js/utils/sortMap.js"></script>
		<script src="../../../../js/utils/http.js"></script>
		<script src="../../../../js/utils/vue.min.js"></script>
		<script src="../../../../js/app.js"></script>
		<!-- 基础js end -->


		<!-- app.jumpTo("/view/service/report/preview/fuwunr.html", "view/service/report/preview/fuwunr.html", {
				enginnerId: "140",
				serviceNo: "1219113",
				reportGuid: "61"
			}) -->
		<script type="text/javascript" charset="utf-8">
			var serviceNo, reportId, reportNo

			function getDefaultData() {
				return {
					SellOrderNo: '', // FactoryPO#
					CONTRACT_ID: '', // 合同编号
					EngRep_No: '', // 服务报告编号
					service_no: '', // Service号 派工号
					customer: '', // 用户
					engineer_name: '', // 工程师姓名
					dept_address: '', // 地址
					operator: '', // 负责人
					mobile: '', // 手机号
					email: '', // 邮箱
					model: '', // 仪器型号
					serial_no: '', // 序号
					computer: '', // 计算机
					service_number: '', // 服务号
					province: '', // 省份
					postal_code: '', // 邮编
					phone_no: '', // 电话
					fax_no: '', // 传真
					software: '', // 软件
					operation_system: '', // 操作系统
					service_type: '', // 服务类型
					order_received_date: '', // 接收任务时间
					start_travel_date: '', // 出发时间
					on_site_data: '', // 到达现场时间
					travel_time: 0, // 总旅途时间（小时）
					start_working_time: '', // 工作开始时间
					end_working_time: '', // 工作结束时间
					total_working_hours: 0, // 总工作时间（小时）
					app_support_hours: 0, // 应用支持时间（小时)
					waiting_hours: 0, // 等待客户时间（小时）
					problem: '', // 故障
					action_taken: '', // 工作过程
					results: '', // 结果
					engineers_advis: '', // 工程师建议
					ManHours: 0, // 小时数
					ManRate: 0, // 单价
					ManTotal: 0, // 总价

					BasicFee: 0, // 基本费
          EspeciallyFee: 0, //特殊费用
					TravelHotel: 0, // 旅途住宿费
					TravelLabor: 0, // 旅途人工
					PartsTotallFee: 0, //备件总费用
					RebTotalBilled: 0, // 总费用
					Feevisible: 0, //是否显示服务费
					FeeBalanceType: 1, //显示方式 0 旅途住宿/1基本费/2基本费+特殊费

					partDatas: [] // 备件信息
				}
			}

			var vm = new Vue({
				el: '.mui-content',
				data: getDefaultData(),
				computed: {
					isShowPartData: function(){
						return this.partDatas.length > 0
					}
				},
				methods: {
					resetData: function() { //重置数据
						Object.assign(this.$data, getDefaultData());
					}
				}
			});


			(function($, doc) {
				$.init();

				$.plusReady(function() {
					var self = plus.webview.currentWebview();
					serviceNo = self.serviceNo;
					reportId = self.reportId;
					reportNo = self.reportNo;
					vm.reportNo = reportNo
					initData()
					getDetails()
				});
			}(mui, document));
			
			function getDetails(){
				ajaxGet(BASE_URL + "cc/notice/getDetailsByServiceNo", {
					"serviceNo": serviceNo
				}, function(data) {
					// console.log(JSON.stringify(data))
					/*if (data.code == 200) {
						if(data.data!=""){
							if(data.data.subServiceType=='安装' || data.data.isWarranty=='保内'){
								h("#fwfy").hide();
							}
						}
					}*/
				}, function(errorMsg) {
					console.log(JSON.stringify(errorMsg))
				});
			}

			function initData() {
				var enginnerId = app.getUser().enginnerId;
				app.showWaiting();
				ajaxGet(BASE_URL + 'cc/report/preview/fieldServiceReport', {
					enginnerId: enginnerId,
					serviceNo: serviceNo,
					reportGuid: reportNo
				}, function(data) {
					app.closeWaiting()
					if (data.code === 200) {
						var ccData = JSON.parse(data.data)
						console.log(ccData)

						if (ccData.status == '1') {
							var record = ccData.record;
							if (record && record.length > 0) {
								var info = record[0];

								h("#fwfy").hide();
								h("#divBasicFee").hide();
								h("#divEspeciallyFee").hide();
								h("#divTravelHotel").hide();
								h("#divTravelLabor").hide();

								// FactoryPO#
								vm.SellOrderNo = info.SellOrderNo
								// 合同编号
								vm.CONTRACT_ID = info.CONTRACT_ID
								// 服务报告编号
								vm.EngRep_No = info.EngRep_No
								// Service号
								vm.service_no = info.service_no
								// 工程师姓名
								vm.engineer_name = info.engineer_name
								// 用户
								vm.customer = info.customer
								// 地址
								vm.dept_address = info.dept_address
								// 负责人
								vm.operator = info.operator
								// 手机号
								vm.mobile = info.mobile
								// 邮箱
								vm.email = info.email
								// 仪器型号
								vm.model = info.model
								// 序号
								vm.serial_no = info.serial_no
								// 计算机
								vm.computer = info.computer
								// 服务号
								vm.service_number = info.service_number
								// 省份
								vm.province = info.province
								// 邮编
								vm.postal_code = info.postal_code
								// 电话
								vm.phone_no = info.phone_no
								// 传真
								vm.fax_no = info.fax_no
								// 软件
								vm.software = info.software
								// 操作系统
								vm.operation_system = info.operation_system
								// 服务类型
								vm.service_type = info.service_type
								// 接受任务时间
								vm.order_received_date = info.order_received_date
								// 出发时间
								vm.start_travel_date = info.start_travel_date
								// 到达现场时间
								vm.on_site_data = info.on_site_data
								// 总旅途时间（小时）
								vm.travel_time = info.travel_time
								// 工作时间（开始）
								vm.start_working_time = info.start_working_time
								// 工作时间（结束）
								vm.end_working_time = info.end_working_time
								// 总工作时间（小时）
								vm.total_working_hours = info.total_working_hours
								// 应用支持时间（小时）
								vm.app_support_hours = info.app_support_hours
								// 等待客户时间（小时）
								vm.waiting_hours = info.waiting_hours
								// 故障
								vm.problem = info.problem
								// 工作过程
								vm.action_taken = info.action_taken
								// 结果
								vm.results = info.results
								// 工程师建议
								vm.engineers_advis = info.engineers_advis
								// 小时数
								vm.ManHours = info.ManHours
								// 单价
								vm.ManRate = info.ManRate
								// 总价
								vm.ManTotal = info.ManTotal

								// 基本费
								vm.BasicFee = info.BasicFee
								//特殊费用
								vm.EspeciallyFee = info.EspeciallyFee
								// 旅途住宿费
								vm.TravelHotel = info.TravelHotel
								// 旅途人工
								vm.TravelLabor = info.TravelLabor
								//备件总费用
								vm.PartsTotallFee = info.PartsTotallFee
								// 总费用
								vm.RebTotalBilled = info.RebTotalBilled

								//是否显示服务费
								vm.Feevisible = info.Feevisible
								//显示方式 0 旅途住宿/1基本费/2基本费+特殊费
								vm.FeeBalanceType = info.FeeBalanceType

								//if(info.service_type === '安装' || info.service_type === '保内'){
								if(vm.Feevisible === '1'){
									h("#fwfy").show();

									if(vm.FeeBalanceType=="0"){
										h("#divBasicFee").hide();
										h("#divEspeciallyFee").hide();
										h("#divTravelHotel").show();
										h("#divTravelLabor").show();
									} else if(vm.FeeBalanceType=="1"){
										h("#divBasicFee").show();
										h("#divEspeciallyFee").hide();
										h("#divTravelHotel").hide();
										h("#divTravelLabor").show();
									} else if(vm.FeeBalanceType=="2"){
										console.log(vm)
										if (Number(vm.BasicFee)){
											h("#divBasicFee").show();
											h("#divEspeciallyFee").show();
											h("#divTravelHotel").hide();
											h("#divTravelLabor").show();
										}else {
											h("#divEspeciallyFee").show();
											h("#divTravelHotel").show();
											h("#divTravelLabor").show();
											// h("#divBasicFee").hide();
										}

									}
								}
								else {
									h("#fwfy").hide();
								}

								// 备件信息
								var ccPartData = info.Part_data
								if (!JS.IsNullOrEmpty(ccPartData)) {
									vm.partDatas = JSON.parse(ccPartData)
								}
							}
						} else {
							app.toast(ccData.message || '查询失败')
						}
					} else {
						app.toast(data.msg)
					}
				}, function(errorMsg) {
					app.closeWaiting()
					app.toast(errorMsg)
				});
			}
		</script>
		<!-- js代码 end -->
	</body>
</html>
